<template>
	<view class="timedTask-container">
		<view class="task-table" v-if="taskList.length>0">
			<view class="table-item table-head">
				<text class="task-name">任务名称</text>
				<text class="operate">操作</text>
			</view>
			<view class="table-item" v-for="item in taskList" :key="item.id">
				<view class="task-name">{{item.title}}</view>
				<view class="operate">
					<text @tap="handleDelete(item.id)">删除</text>
					<text @tap="handleEdit(item.id)">编辑</text>
				</view>
			</view>
		</view>
		
		<view class="empty-box" v-else>
			<image src="https://static.mo-yu.vip/wechat/images/orderEmpty.png"></image>
		</view>
		
		<view class="bottom-btn">
			<view class="btn" @tap="goPage('/pages-activation/addAndEditTask?type=add')">新建定时任务</view>
		</view>
	</view>
</template>

<script>
	export default{
		data(){
			return{
				taskList:[]	
			}
		},
		onShow() {
			this.getTaskList()
		},
		
		methods:{
			getTaskList(){
				this.$tools.loadIng()
				this.$request.post(this.$api.smartTaskList, {
					store_id:uni.getStorageSync('store_id')
				}, {
					token:true
				}).then(res => {
					let {
						data = {}
					} = res;
					if (res.code==1) {
						this.taskList=data
					}
				}).finally(() => {
					this.$tools.hideLoading()
				})
			},
			
			handleEdit(id){
				uni.navigateTo({
					url:'/pages-activation/addAndEditTask?type=edit&id='+id
				})
			},
			
			handleDelete(id){
				uni.showModal({
					title: '确定删除该任务？',
					success: res=> {
						if (res.confirm) {
							// console.log('用户点击确定');
							this.$request.post(this.$api.deleteTask, {
								tasks_id:id
							}, {
								token:true
							}).then(res => {
								let {
									data = {}
								} = res;
								if (res.code==1) {
									this.$tools.showToast('删除成功')
									setTimeout(()=>{
										this.getTaskList()
									},600)
								}
							})
						} else if (res.cancel) {
							// console.log('用户点击取消');
						}
					}
				});
			},
			
		}
	}
</script>

<style lang="scss" scoped>
	.timedTask-container{
		padding: 32rpx;
	}
	.task-table{
		background: #1D1C5C;
		border-radius: 16rpx;
		overflow: hidden;
		margin-bottom: 180rpx;
		.table-item{
			display: flex;
			color: #fff;
			text-align: center;
			border-bottom:1rpx solid  rgba(255,255,255,0.5);
			&:nth-child(2n){
				background: #353484;
			}
			&:last-child{
				border-bottom: unset;
			}
			.task-name{
				width: 65%;
				font-size: 28rpx;
				border-right:2rpx solid  rgba(255,255,255,0.5);
				padding: 16rpx 10rpx;
				box-sizing: border-box;
			}
			.operate{
				width:35%;
				font-size: 28rpx;
				padding: 16rpx 10rpx;
				box-sizing: border-box;
				display: flex;
				justify-content: center;
				gap:30rpx;
			}
		}
		.table-head{
			>text{
				font-weight: bold;
				font-size: 30rpx !important;
			}
		}
	}
	.bottom-btn{
		width: 100%;
		position: fixed;
		bottom: 88rpx;
		left: 0;
		.btn{
			width: 670rpx;
			height: 80rpx;
			margin: 0 auto;
			background: rgb(31, 124, 247);
			border-radius: 72rpx;
			font-size: 34rpx;
			color: #fff;
			display: flex;
			justify-content: center;
			align-items: center;
		}
	}
</style>